﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="LotteryOpen.aspx.cs" Inherits="SY.WebSite.Web.Jifen.LotteryOpen" %>

<!DOCTYPE html>
<html lang="en">
<head>
    <title>开奖 - <%= CurrentLottery.Title %> - <%= Settings.Title %></title>
    <link href="<%= Settings.StaticFileDomain %>/Themes/Foundation/stylesheets/foundation.min.css" rel="stylesheet" type="text/css" />
    <link href="<%= Settings.StaticFileDomain %>/Themes/Default/index.css" rel="stylesheet" type="text/css" />
    <link href="<%= Settings.StaticFileDomain %>/Scripts/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />
    <script src="<%= Settings.StaticFileDomain %>/Scripts/jquery-lottery.js" type="text/javascript"></script>
	<script src="<%= Settings.StaticFileDomain %>/Scripts/jquery-ui-1.7.2.custom.min.js"type="text/javascript" ></script>
    <!--[if lt IE 9]>
        <script src="<%= Settings.StaticFileDomain %>/Scripts/html5.js" type="text/javascript"></script>
    <![endif]-->
    
    <style type="text/css">
        .column, .columns{ padding: 0 5px;}
        #rolling_board{
	        color: #000;
	        line-height: 40px;
	        font-size: 40px;
	        font-weight: bold;
	        margin: 34px auto;
	        padding: 8px;
	        width: 640px;
	        text-align: center;
	        border: solid 1px goldenrod;
        }
        #print_box{
	        margin: 30px 0;
	        font-weight: bold;
	        font-size: 28px;
	        text-align: center;
        }
        #print_box span{
	        margin: 4px;
	        color: #fff;
	        background: #36f;
        }
    </style>
</head>
<body>
    <div class="row">
        <div class="nine columns">
            <div class="panel tuan_detail_main">
                <div class="tuan_detail_main">
                    <h1 class="c_tx2"><a href="javascript:void(0);"><%= CurrentLottery.Title %></a></h1>
                    <div class="details_bar clearfix">
                        <div class="tuan_details_info">
                            <div class="tuan_details_box">
                                <div class="details_buy" style="padding-top:40px;">
                                    <div class="price_all">
                                        <p class="price">
                                            <span class="original_price">超 <strong><%= CurrentLottery.LimitAmount %>素币</strong>可参与抽奖</span>
                                        </p>
                                        <p class="discount_price"><span class="num_price"><%= CurrentLottery.CostAmount %></span>素币</p>
                                    </div>
                                </div>
                                <div class="tuan_result">
                                    <p class="tuan_result_status"><span><%= CurrentLottery.Participants.Split(new char[]{','}, StringSplitOptions.RemoveEmptyEntries).Length %></span>&nbsp;人参与</p>
                                    <div class="tuan_item">
                                        <strong id="time_title" class="end"><%= CurrentLottery.OpenTime.ToString("yyyy年MM月dd日 HH:mm") %>结束</strong>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tuan_details_photo">
                            <div class="banner_large">
                                <ol class="banner_content">
                                    <li id="showDetailPhoto"><img src="<%= CurrentLottery.Image %>" title="<%= CurrentLottery.Title %>" alt="<%= CurrentLottery.Title %>" /></li>
                                </ol>
                            </div>
                        </div>
                        <strong class="tuan_details_filter"></strong>
                    </div>
                </div>
                <% if (CurrentLottery.Status == 1) { %>
                   <h3><strong>中奖者：<%= CurrentLottery.Winner %></strong></h3>
                <% } else { %>
                <h3 id="result" style="display: none;">
                    <strong>中奖者：<span></span></strong>
                </h3>
                <% } %>
            </div>
            <% if (CurrentLottery.Status == 0 && CurrentLottery.UserId == CurrentUser.UserId && CurrentLottery.OpenTime <= DateTime.Now) { %>
            <div id="tabs-1" class="panel">
	            <div id="rotate_div">
		            <div><span id="current_step"></span></div>
		            <div id="print_box"></div>
		            <div id="rolling_board"></div>
	            </div>
            </div>
            <% } %>
        </div>
        
        <div class="three columns">
            <div class="panel rank" style="margin:0">
                <h5>参与名单</h5>
                <ul>
                <% if(Participants!=null&&Participants.Count>0) {
                       foreach (var user in Participants)
                       {
                       %>
                    <li><span><%= user["UserName"] %>(<%= user["JobNumber"] %>)</span></li>
                <%
                       }
                   } else{%>
                <li><span>无人参与</span></li>
                <%}%>
                </ul>
                <br/>
            </div>
        </div>
    </div>
    
    <% if (CurrentLottery.Status == 0 && CurrentLottery.UserId == CurrentUser.UserId && CurrentLottery.OpenTime <= DateTime.Now) { %>
    <script type="text/javascript">
        var game;
        $(function () {
            game = new Game();
            save_setting();
        });
        // 绑定回车键盘操作
        $(document).keypress(function (e) {
            switch (e.which) {
                case 13:
                    game.process();
                    break;
            }
        });
        
        function in_array(item, list) {
            for (var i = 0; i < list.length; i++) {
                if (item == list[i]) {
                    return true;
                }
            }
            return false;
        }

        /**
        * 返回指定元素在数组中的索引, 如果没找到, 返回-1;
        */
        function array_find(list, item) {
            for (var i = 0; i < list.length; i++) {
                if (item == list[i]) {
                    return i;
                }
            }
            return -1;
        }

        // 从数组中删除元素. 返回新数组.
        function array_del(list, item) {
            var arr = [];
            for (var i = 0; i < list.length; i++) {
                if (item != list[i]) {
                    arr.push(list[i]);
                }
            }
            return arr;
        }

        // 从数组中删除元素. 返回新数组.
        function array_del_all(list, items) {
            var arr = [];
            for (var i = 0; i < list.length; i++) {
                if (array_find(items, list[i]) == -1) {
                    arr.push(list[i]);
                }
            }
            return arr;
        }

        /**
        * 把数组当作环形的, 返回从start开始, 一共count个元素.
        * 如果count大于数组长度, 返回整个数组.
        */
        function array_slice(list, start, count) {
            var ret;

            ret = list.slice(start, start + count);
            if (ret.length < count) {
                ret = ret.concat(list.slice(0, count - ret.length));
            }

            return ret;
        }

        // 扰乱数组元素的顺序.
        function array_shuffle(list) {
            var len = list.length;
            for (var i = 0; i < len * 5; i++) {
                var p1 = parseInt(len * Math.random());
                var p2 = parseInt(len * Math.random());
                var tmp = list[p1];
                list[p1] = list[p2];
                list[p2] = tmp;
            }
        }
    
        var Game = function() {
            var self = this;

            this.step = -1;
            this.interval = 100;
            this.rotate_index = 0;
            self.action = 'open';

            this.prizes = [];
            this.candidates = [];
            this.results = [];

            this.init = function() {
                this.step = 0;
                this.stop = false;
                this.rotate_index = 0;
                self.action = 'open';
                this.results = [];

                for (var i = 0; i < self.prizes.length; i++) {
                    var p = self.prizes[i];
                    self.results[i] = [];
                }
                print_box('请按回车开始');

                $('#rolling_board').hide();
            };

            this.reset = function() {
                this.prizes = [];
                this.candidates = [];
                this.results = [];
            };

            this.process = function() {
                // 先更新状态再执行函数
                switch (self.action) {
                case 'open':
                    self.action = 'rotate_stop';
                    on_rotate_start();
                    break;
                case 'close':
                    self.action = '';
                    on_close();
                    break;
                case 'rotate_stop':
                    on_rotate_stop();
                    break;
                default:
                    break;
                }
            };
        };

        function on_close() {
            $.post("/handler/lottery.ashx?action=open", { id: <%= CurrentLottery.Id %>, jobNumber: game.results[0].JobNumber }, function(data) {
                if (data.error) {
                    alert(data.error);
                    return false;
                }
                window.location.reload();
            }, "json");
        }

        function on_rotate_start() {
            $('#rolling_board').slideDown('fast');
            game.interval = 50;
            game.stop = false;
            game.rotate_index = 0;
            // 打乱顺序
            array_shuffle(game.candidates);
            rotate_run();
            print_box('按回车停止');
        }
    
        function on_rotate_stop() {
            // 等一段随机时间再停止.
            game.interval += parseInt(0.9 * game.interval);
            setTimeout('game.stop=true', 230 + parseInt(230 * Math.random()));
            //game.stop = true;
        }

        function rotate_run() {
            if (game.stop)
                game.candidates = <%= ToJson(Lucky) %>;
            
            var arr = array_slice(game.candidates, game.rotate_index, 1);
            $('#rolling_board').html(arr[0].UserName + "(" + arr[0].JobNumber + ")");

            game.rotate_index ++;
            if (game.rotate_index >= game.candidates.length) {
                game.rotate_index -= game.candidates.length;
            }

            if (game.stop) {
                game.results = arr;
                game.candidates = array_del_all(game.candidates, arr);

                game.action = 'close';
                print_box('按回车提交开奖结果');

                $('#rolling_board').css({ "color": "#f33" });
            } else {
                setTimeout('rotate_run()', game.interval);
            }
        }

        function print_box(str) {
            if (str == '') {
                $('#print_box').hide('fast');
            } else {
                $('#print_box').html(str);
                $('#print_box').show();
            }
        }

        function show_results() {
            $('#result').show().find("span").html(game.results[0].UserName + "(" + game.results[0].JobNumber + ")");
        }
    
        function save_setting() {
            game.reset();
            game.candidates = <%= ToJson(Participants) %>;
            game.init();
        }
    </script>
    <% } %>
</body>
</html>